import { topConfig } from "./layout/skeleton";
/*
 * @Author       : 邱狮杰
 * @Date         : 2021-03-30 15:36:31
 * @LastEditTime: 2021-03-30 23:18:35
 * @FilePath: /upload-template/webpackUploadTemplate/src/index.ts
 * @Description  : run entry
 */
import "./css/alert.css";
import "./css/main.css";
import "./css/skeleton.css";

import {
  init,
  classModule,
  propsModule,
  styleModule,
  eventListenersModule,
  h,
} from "snabbdom";
import {
  reflectionProperty,
  hasReflectionProperty,
  getReflectionProperty,
} from "./utils/reflection";
import { top } from "./layout/skeleton";
import { returnTopDefaultConfig } from "./layout/top";
import { uploadTemplateConfig } from "./types/config";
// const barTextList = ["本地音频", "全部音频"];
// const topBar = barTextList.map((item, index) => ({
//   text: item,
//   fn: function (userFn) {
//     userFn(item, index);
//   },
// }));

const patch = init([
  classModule,
  propsModule,
  styleModule,
  eventListenersModule,
]);

class UploadTemplate {
  constructor(config: uploadTemplateConfig) {
    const userConfig = this.config(config);
    const Root = document.getElementById("container");
    // init top component
    const container = h("div#container", { id: "container" }, [
      top((userConfig.topBarClick as unknown) as topConfig[]),
    ]);
    patch(Root as Element, container);
  }
  config(conf: uploadTemplateConfig): uploadTemplateConfig {
    // init config
    let backUpConf = JSON.parse(JSON.stringify(conf));
    reflectionProperty(
      backUpConf,
      "topBarClick",
      returnTopDefaultConfig(() => {})
    );
    if (hasReflectionProperty(conf, "topBarClick"))
      reflectionProperty(
        backUpConf,
        "topBarClick",
        returnTopDefaultConfig(getReflectionProperty(conf, "topBarClick"))
      );
    console.log(backUpConf.topBarClick);
    return backUpConf;
  }
}

new UploadTemplate({
  topBarClick(item: string | undefined, index: number | undefined) {
    console.log(item, index);
  },
});
